<!--文章管理界面-->
<template>
    <div>
        <Table border :columns="columns7" :data="data6"></Table>
        <Page :total="total" :current="page" @on-change="changePage" show-total />
    </div>
</template>
<script>
    export default {
        data () {
            return {
                page:1,
                per_page:10,
                total:0,
                columns7: [
                    {
                        title: '标题',
                        key: 'title',
                        render: (h, params) => {
                            return h('div', [
                                h('strong', params.row.title)
                            ]);
                        }
                    },
                    {
                        title: '副标题',
                        key: 'subtitle',
                    },
                    {
                        title: '排序',
                        key: 'top',
                    },
                    {
                        title: '排序',
                        key: 'top',
                    },
                    {
                        title: '简介',
                        key: 'abstr'
                    },
                    {
                        title: '图片',
                        key: 'imgUrl',
                        render: (h, params) => {
                            return h('div', [
                                h('Button', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.show(params.row['imgUrl'])
                                        }
                                    }
                                }, '查看'),
                            ]);
                        }
                    },
                    {
                        title: '分类',
                        key: 'type_name'
                    },
                    {
                        title: '建立时间',
                        key: 'create_time'
                    },
                    {
                        title: '内容',
                        ellipsis:true,
                        key: 'content'
                    },
                    {
                        title: '标签',
                        key: 'key_value'
                    },
                    {
                        title: 'Action',
                        key: 'action',
                        width: 150,
                        align: 'center',
                        render: (h, params) => {
                            return h('div', [
                                h('Button', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.show(params.index)
                                        }
                                    }
                                }, '置顶'),
                                h('Button', {
                                    props: {
                                        type: 'error',
                                        size: 'small'
                                    },
                                    on: {
                                        click: () => {
                                            this.remove(params.index,params.row.id)
                                        }
                                    }
                                }, '删除')
                            ]);
                        }
                    }
                ],
                data6:[]
            }
        },
        mounted:function () {
            this.getArticle();
        },
        methods: {
            show (index) {
                this.$Modal.confirm({
                    title: '图片',
                    content: '<img src='+index+'>'
                })
            },
            encodeHtml(str){
        var encodedStr = "" ;
        if (str=="") return encodedStr ;
        else {
            for (var i = 0 ; i < str.length ; i ++){
                encodedStr += "&#" + str.substring(i, i + 1).charCodeAt().toString(10) + ";" ;
            }
        }
        return encodedStr ;
    },
            remove (index,id) {
                var that = this;
                this.$Modal.confirm({
                    title: '提示',
                    content: '<p>确定要删除该条记录吗？</p>',
                    onOk: () => {
                        this.fetch({
                            url: '/delete', //1为获取type
                            method: 'GET',
                            params: {
                                type:1,
                                id:id
                            }
                        }).then(function (response) {
                          if(response.data.ret==1){
                              that.data6.splice(index, 1);
                              that.$Message.success('删除成功');
                              that.getArticle();
                          }
                        });
                    },
                    onCancel: () => {
                      /*  this.$Message.info('Clicked cancel');*/
                    }
                });
            },
            changePage(page){
                 this.page = page;
                 this.getArticle();
            },
            getArticle(){
                var that = this;
                this.fetch({
                    url: '/article', //1为获取type
                    method: 'GET',
                    params: {
                             type:1,
                              page:that.page,
                        per_page:that.per_page
                    }
                }).then(function (response) {
                    that.data6 = response.data.rows;
                    for(var i in that.data6){
                        that.encodeHtml(that.data6[i]['content'])
                    }
                    that.total = response.data.total;
                });
            }
        },
        }
</script>